<template>
	<view class="page-content-box" style="margin-top: 15rpx;">
		<view class="bg-w p-x-20 search-content-box">
			<view class="search-input">
				<input class="nav-bar-input" type="text" v-model="keyword" placeholder="搜索">
				<view class="right-img" @click="goToSearch">
					<image style="width: 29rpx; height: 30rpx;margin-top: 15rpx;" mode="aspectFit"
						src="../../static/sousuo.png"></image>
				</view>
			</view>
		</view>
		<view class="category-content-box bg-w">
			<!-- 左侧一级分类列表 -->
			<scroll-view scroll-y class="left-nav-box">
				<view v-for="(item,index) in leftNavData" :key="index"
					:class="leftActiveIndex==index?'left-nav-active left-nav-item':'left-nav-item'">
					<view @tap="toggleLeftTab(index,item.icode)"
						:class="leftActiveIndex==index?'left-active left-nav-name':'left-nav-name'">
						{{item.name}}
					</view>
				</view>
			</scroll-view>

			<view class="right-nav-content bg-w">
				<!--顶部导航栏-->
				<!-- <view class="index-tab-bar bg-w">
					<view class="right-swiper-tab swiper-tab-box">
						<block v-for="(item,index) in rightNavData" :key="index">
							<view v-if="index<5" class="swiper-tab-list" :class="{'active': rightActiveIndex==index}"
								@tap="toggleRightTab(index)">
								{{item.value}}
							</view>
						</block>
						<view v-if="rightNavData.length>=3" class="tab-icon-box" @click="moreTabShow=true"></view>
						<view class="more-tab-bg" v-if="rightNavData.length>=3&&moreTabShow" @click="moreTabShow=false">
							<view class="tab-icon-box tab-up-box" @click="moreTabShow=false"></view>
							<view class="more-tab-box">
								<view class="title">全部分类</view>
								<view class="tab-item-box flex-block-row">
									<block v-for="(item,index) in rightNavData" :key="index">
										<view class="tab-item" :class="{'active': rightActiveIndex==index}"
											@click.stop="toggleRightTab(index)">
											{{item.value}}
										</view>
									</block>
								</view>
							</view>
						</view>
					</view>
				</view> -->
				<!--内容区-->
				<view class="right-tab-content">
					<!-- <swiper :disable-touch="true" class="category-swiper" :circular="true">
						<swiper-item v-for="(item,index) in rightNavData" @touchmove.stop="stopTouchMove" :key="index"
							class="category-swiper-item">
							<scroll-view scroll-y style="height: 100%;" @scrolltolower="loadingMore"> -->
								<view class="good-choose category-goods">
									<view v-if="rightNavData.length==0 && hasload" class="no-data-box">
										<image style="width: 243rpx; height: 212rpx;" mode="aspectFit"
											src="../../static/wushuju.png"></image>
										<view>客官，这里暂无数据哦</view>
									</view>
									<block v-for="(item,index) in rightNavData" :key="index">
										<view class="good-item"
											style="display: flex;flex-flow: row nowrap;align-items: center;justify-content: space-around;">
											<navigator :url="'/pages/goodsdetail/goodsdetail?id='+item.icode"
												hover-class="none" class="position-r">
												<view class="good-img">
													<image style="width: 160rpx; height: 160rpx;border-radius: 10rpx;"
														mode="aspectFill" :src="baseUrl+'/api/sys/file/download?attachId=' + item.coverImgId+'&width=300'"></image>
												</view>
											</navigator>
											<view class="good-content position-r" style="width: 280rpx;padding:25rpx;">
												<navigator
													:url="'/pages/goodsdetail/goodsdetail?id='+item.icode"
													hover-class="none" class="position-r">
													<view class="name">{{item.name}}/{{item.unit}}</view>
													<!-- <view class="tag-box"><text class="tag tag-green" style="margin-right: 10rpx;">五星级服务</text> -->
													<view style="font-size: 22rpx;color: #999;margin-top: 30rpx;"><text
															class="new-cost">￥{{item.price}}</text>/<text
															class="old-cost"
															style="text-decoration: line-through;">￥{{item.linePrice}}</text>
													</view>
												</navigator>
											</view>
											<view class="">
												<view class="edit-box">
													<button plain="true" :data-idx="item.id"
														class="cart-btn" style="padding-right:35rpx" @click.stop="reduce(item,index)">
														<image style="width: 24rpx; height:24rpx;" mode="aspectFit"
															src="../../static/jian.png"></image>
													</button>
													<text>{{ item.num }}</text>
													
													<button plain="true" :data-idx="item.id"
														class="cart-btn" style="padding-left:35rpx" @click.stop="add(item,index)">
														<image style="width:54rpx; height: 54rpx;" mode="aspectFit"
															src="../../static/add1.png"></image>
													</button>
												</view>
												<view v-if="item.num >0" class="" style="color: #fda600;" @click="addRemark(item,index)" >
													添加备注
												</view>
												
											</view>
											
												
										</view>
									</block>
								</view>
								<view v-if="ishide" class="loader" style="padding-top: 0;">
									<view class="loader-inner ball-pulse">
										<view></view>
										<view></view>
										<view></view>
									</view>
								</view>
								<view v-if="noMore" class="loading-more-text" style="padding-top: 20rpx;">暂无更多数据</view>
							<!-- </scroll-view>
						</swiper-item>
					</swiper> -->
				</view>
			</view>
			<!-- 底部统计 -->
			<view class="cart-bottom-box">
				<!-- 全选 -->
				<view class="cart-bottom-box-row">
					<view class="check-all-box">
						<view class="" style="display: flex;flex-direction: row;align-items: center;" v-if="tableCode !=''">
							{{tableCode}}
							 <!-- <span style="color: #fda600;" @click="showDialog=true">[切换餐台]</span> -->
						</view>
						<view class="" v-else @click="changeTableAuth">
							请选择桌台
						</view>
					</view>
					<!-- <view class="all-cost">
						<view>合计: <text>￥{{totalPrice}}</text></view>
					</view> -->
					<view class="buy-btn-box">
						<button  class="to-pay" type="primary" @click="goBuyNow">去下单（{{carListCheck.length}}）</button>
					</view>
				</view>
				
			</view>
			<view class="dialog-center-bg" v-if="showDialog" @click="showDialog=false"></view>
			<view class="dialog-center-content" v-if="showDialog">
				<view class="dialog-center-title">选择桌台</view>
				<view class="form-box">
					<radio-group name="ordertype" class="send-radio flex-block-row radio-big" @change="changeTable">
						<label class="flex-1"  >
							<view v-for="(item,index) in tabelCodeList" :key="index" style="padding: 10rpx 20rpx;">
								<radio :value="item.name"  />
								<text style="font-weight: bold;">{{item.name}}</text>
								
							</view>
						</label>
						
					</radio-group>
					<view class="input-box" style="display: flex;flex-direction: row;align-items: center;">
						用餐人数<input class="uni-input input-content" style="margin-left: 20rpx;" v-model="peopleCount" placeholder-class="input-place" maxlength="30" name="input" placeholder="请输入用餐人数" type="number" />
					</view>
				</view>
				<view class="btn-box">
					<button class="dlg-btn close-btn" type="primary" @click="showDialog=false">取消</button>
					<button class="dlg-btn submit-btn" type="primary" @click="confirmTableCode">提交</button>
				</view>
			</view>
			<view class="dialog-center-bg" v-if="showDialogRemark" @click="showDialogRemark=false"></view>
			<view class="dialog-center-content" v-if="showDialogRemark">
				<view class="dialog-center-title">{{showDialogRemarkTitle}}</view>
				<view class="form-box">
					
					<view class="input-box" style="display: flex;flex-direction: row;align-items: center;">
						<input class="uni-input input-content" style="margin-left: 20rpx;" v-model="showDialogRemarkItem" placeholder-class="input-place" maxlength="30" name="input" :placeholder="'请输入'+showDialogRemarkTitle+'的备注'"  />
					</view>
				</view>
				<view class="btn-box">
					<button class="dlg-btn close-btn" type="primary" @click="showDialogRemark=false">取消</button>
					<button class="dlg-btn submit-btn" type="primary" @click="confirmRemark">保存备注</button>
				</view>
			</view>
			<!-- 是否进行登录的弹窗 -->
			<view class="dialog-center-bg" v-if="!hasLogin" @click="hasLogin=true"></view>
			<view class="dialog-center-content" v-if="!hasLogin">
				<view class="dialog-center-title">你还没未登录,请先的登录</view>
				
				<view class="btn-box">
					<button class="dlg-btn close-btn" type="primary" @click="hasLogin=true">取消</button>
					<button class="dlg-btn submit-btn" type="primary" @click="goToLogin">去登录</button>
				</view>
			</view>
		</view>
		<!-- <toast></toast> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				baseUrl: this.$client.IMG_URL,
				moreTabShow: false,
				leftActiveIndex: 0,
				rightActiveIndex: 0,
				leftNavData: [],
				rightNavData: [],
				product_category_list: [],
				keyword: '',
				ishide: false,
				noMore: false,
				hasload: false,
				pager: {
					page: 1,
					pageSize: 20,
					total: 0
				},
				product_list: [],
				desk_number: '',
				carListCheck:[],
				totalPrice:0,
				tableCode:'',
				showDialog:false,
				tabelCodeList:[],
				peopleCount:'', //用餐人数
				showDialogRemark:false,//备注
				showDialogRemarkTitle:'',
				showDialogRemarkItem:'',
				tempRemarkItem:{},
				remarkIndex:0,
				hasLogin:false
			}
		},
		onLoad() {
			this.pager.page = 1;
			this.leftNavData = 0;
			this.rightNavData = 0;
			this.product_category_list = [];
			this.product_list = [];
			uni.setNavigationBarColor({
			    frontColor: '#000000',
			    backgroundColor: '#FDA600'
			})
		},
		onShow() {
			if(uni.getStorageSync("token")&&uni.getStorageSync("userInfo")){
				this.hasLogin=true
			}else{
				this.hasLogin=false
			}
			this.desk_number = uni.getStorageSync('deskNumber');
			
			this.pager.page = 1;
			if (this.product_category_list.length > 0) {
				// 初始化按钮
				this.getInitData(this.keyword);
			} else {
				this.getInitData(this.keyword);
			}
			this.getTableCodeList() //桌台列表
		},
		methods: {
			//去登录
			goToLogin(){
				if(!(uni.getStorageSync("token"))) {
					uni.navigateTo({
					    url: "/pages/hrlogin/hrlogin"
					});
					return;
				}
			},
			//保存备注
			confirmRemark(){
				this.rightNavData[this.remarkIndex].remark=this.showDialogRemarkItem
				this.carListCheck.forEach((item)=>{
					if(item.cookId==this.tempRemarkItem.icode){
						item.remark=this.showDialogRemarkItem
					}
				})
				this.$nextTick(()=>{
					this.showDialogRemark=false
				})
				console.log(this.carListCheck,"已勾选的")
			},
			//添加备注
			addRemark(data,index){
				//this.showDialogRemarkItem=""
				this.remarkIndex=index
				this.tempRemarkItem=data
				this.showDialogRemarkItem=data.remark
				this.showDialogRemarkTitle=data.name
				this.showDialogRemark=true
				
			},
			//确定桌台
			confirmTableCode(){
				
				// this.tableCode=this.tableCode
				this.showDialog=false
			},
			//选择桌台
			changeTable(e){
				console.log(e.target.value,"选择桌台")
				this.tableCode=e.target.value
			},
			//去下单
			goBuyNow(){
				if(uni.getStorageSync("token")&&uni.getStorageSync("userInfo")){
					this.hasLogin=true
					
				}else{
					this.hasLogin=false
					return;
				}
				if(this.carListCheck.length ==0){
					this.$util.showToast({title:"请先选择菜品"});
					return;
				}else if(this.tableCode==''){
					this.$util.showToast({title:"请先选择餐台"});
					return;
				}else{
					//console.log(e)
					var _this = this;
					uni.showLoading({
						title: '加载中...'
					});
					var params = {
						tableCode: _this.tableCode,
						peopleCount: _this.peopleCount,
						listDetail:_this.carListCheck
						
					}
					this.$client.post('/api/biz/order/save', params, function(res, message) {
						//console.log(res);
						uni.hideLoading();
						_this.$util.showToast({
							title: message
						});
						// _this.getInitData(_this.keyword);
						// //成功之后清空已勾选+台桌
						// _this.carListCheck=[]
						// _this.tableCode=''
						setTimeout(()=>{
							uni.reLaunch({
								url: "/pages/paysuccess/confirmOrder"
							},300)
						})
						
					}, function(res) {
						uni.hideLoading();
						if (res) {
							_this.$util.showToast({
								title: res
							});
						}
					}, true);
				}
			},
			changeTableAuth(){
				if(uni.getStorageSync("token")&&uni.getStorageSync("userInfo")){
					this.hasLogin=true
					this.showDialog=true
				}else{
					this.hasLogin=false
					return;
				}
				
			},
			
			getTableCodeList(){
				
				var _this = this;
				
				this.$client.get('/api/biz/table/getListForAdmin', {}, function(res, message) {
					//console.log(res);
					_this.tabelCodeList=res
				}, function(res) {
					uni.hideLoading();
					if (res) {
						_this.$util.showToast({
							title: res
						});
					}
				}, true);
			},
			//加入购物车
			add(item,index){
				
				this.rightNavData.forEach((itemb)=>{
					if(itemb.icode==item.icode ){
						itemb.num+=1
					}
				})
				this.$nextTick(()=>{
					if(this.carListCheck.length >0){
						var checkCarList=[]
						this.rightNavData.forEach((itemb)=>{
							if(itemb.num >0){
								checkCarList.push({
									cookId:itemb.icode,
									count:itemb.num,
									remark:itemb.remark
									})
							}
						})
						this.carListCheck=checkCarList
					}else{
						this.carListCheck.push({
							cookId:this.rightNavData[index].icode,
							count:this.rightNavData[index].num,
							remark:this.rightNavData[index].remark
						})
					}
					console.log(item,index,this.carListCheck,"天机")
				})
				
			},
			//减少数量
			reduce(item,index){
				this.rightNavData.forEach((itemb)=>{
					if(itemb.icode==item.icode && itemb.num >0){
						itemb.num-=1
					}
				})
				this.$nextTick(()=>{
					if(this.carListCheck.length >0){
						var checkCarList=[]
						this.rightNavData.forEach((itemb)=>{
							if(itemb.num >0){
								checkCarList.push({
									cookId:itemb.icode,
									count:itemb.num,
									remark:itemb.remark
									})
							}
						})
						this.carListCheck=checkCarList
					}else{
						this.carListCheck=[]
					}
				})
			},
			getInitData( keyword) {
				var _this = this;
				this.noMore = false;
				_this.hasload = false;
				if (_this.pager.page == 1) {
					_this.$loading();
				} else {
					_this.ishide = true;
				}
				var params = {
					name: keyword,
					// desk_number: this.desk_number,
				};
				params.pageNo = _this.pager.page;
				params.pageSize = _this.pager.pageSize;
				this.$client.get('/api/biz/cook/type/getListForUser', params, function(res, message,total,totalPages) {
					_this.hasload = true;
					console.log(res,"菜单");
					if (_this.pager.totalPages == 1) {
						_this.$loading(false);
					} else {
						setTimeout(() => {
							_this.ishide = false;
						}, 1000)
					}
					if (_this.pager.totalPages > 1) {
						_this.product_list = _this.product_list.concat(res)
					} else {
						_this.leftNavData = res;
						// _this.rightNavData = res.product_category_list[_this.leftActiveIndex].childrens;
						_this.product_category_list = res;
						_this.product_list = res;
					}
					//请求第一个菜单的菜品
					_this.getCategoryForProduct(_this.product_list[0].icode)
					_this.pager.total = res.total;
					_this.pager.page=res.totalPages
					
					// 如果是金刚区调过来
					// var categoryInit = uni.getStorageSync('categoryInit');
					// if(categoryInit != 0){
					// 	// 自动点击对应的菜单
					// 	for(var i in _this.product_category_list){
					// 		if(_this.product_category_list[i].id == categoryInit){
					// 			_this.toggleLeftTab(i);
					// 		}
					// 	}
					// }
					// uni.setStorageSync('categoryInit', 0);
					
				}, function(res) {
					_this.hasload = true;
					if (_this.pager.page == 1) {
						_this.$loading(false);
					} else {
						setTimeout(() => {
							_this.ishide = false;
						}, 1000)
					}
				},true);
			},
			getCategoryForProduct(id){
				var _this = this;
				
				this.$client.get('/api/biz/cook/getListForAdmin',{typeId:id,name:this.keyword}, function(res,message){

					_this.rightNavData=res
					for(var i=0;i <_this.rightNavData.length;i++){
						_this.rightNavData[i].num=0
						_this.rightNavData[i].remark=''
					}
				},function(res){
					
					uni.hideLoading();
					if(res){
						console.log(res,"错误")
						_this.$util.showToast({title:res});
					}
				},true);
			},
			toggleLeftTab(index,icode) {
				console.log(index,icode,"index,+idcode")
				this.leftActiveIndex = index;
				this.rightActiveIndex = 0;
				this.getCategoryForProduct(icode)
				this.pager.page = 1;
				this.product_list = [];
				this.keyword = '';
				// this.getInitData(this.keyword);
			},
			toggleRightTab(index) {
				this.rightActiveIndex = index;
				this.moreTabShow = false;
				this.pager.page = 1;
				this.product_list = [];
				this.keyword = '';
				this.getInitData(this.keyword);
			},
			stopTouchMove() {
				return true;
			},
			loadingMore() {
				if (this.product_list.length >= this.pager.total) {
					this.noMore = true;
				} else {
					this.pager.page++;
					this.getInitData(this.keyword);
				}
			},
			goToSearch() {
				this.moreTabShow = false;
				this.pager.page = 1;
				this.product_list = [];
				// this.getInitData( this.keyword);
				this.getCategoryForProduct(this.leftNavData[this.leftActiveIndex].icode)
			}
		},
		onPullDownRefresh() {
			this.pager.page = 1;
			this.product_list = [];
			this.leftActiveIndex = 0;
			this.rightActiveIndex = 0;
			this.getInitData();
			setTimeout(function() {
				uni.stopPullDownRefresh();
			}, 1000);
		}
	}
</script>

<style>
	.category-content-box {
		height: calc(100% - 60rpx);
		display: flex;
		flex-direction: row;
		padding-top: 10rpx;
		box-sizing: border-box;
	}

	.left-nav-box {
		width: 180rpx;
		height: 100%;
		background: rgba(238, 238, 238, 1);
	}

	.right-nav-content {
		width: 570rpx;
		height: 100%;
		padding-left: 20rpx;
		box-sizing: border-box;
	}

	.left-nav-item.left-nav-active+.left-nav-item {
		border-radius: 0 0 10rpx 0;
	}

	.left-nav-item.left-nav-active~.left-nav-item {
		border-radius: 0 10rpx 0 0;
	}

	.left-nav-item .left-nav-name {
		width: 180rpx;
		height: 100rpx;
		line-height: 100rpx;
		text-align: center;
		font-size: 26rpx;
		font-family: PingFang SC;
		color: rgba(22, 22, 22, 1);
	}

	.left-nav-item .left-nav-name.left-active {
		background: #fff;
		position: relative;
		font-size: 28rpx;
		font-weight: bold;
		color: #fda600;
	}

	.left-nav-item .left-nav-name.left-active::before {
		content: '';
		display: inline-block;
		width: 10rpx;
		height: 40rpx;
		background: rgba(253, 166, 0, 1.0);
		border-radius: 0 10rpx 10rpx 0;
		position: absolute;
		left: 0;
		top: 30rpx;
	}

	.index-tab-bar,
	.right-swiper-tab {
		height: 60rpx;
		white-space: nowrap;
	}

	.swiper-tab-box {
		position: relative;
	}

	.swiper-tab-box .tab-icon-box {
		height: 60rpx;
		width: 62rpx;
		padding: 24rpx 20rpx;
		box-sizing: border-box;
		position: absolute;
		right: 0;
		top: 0;
		background-color: #fff;
		z-index: 200;
	}

	.swiper-tab-box .tab-icon-box::before {
		content: '';
		width: 0px;
		height: 0px;
		border-style: solid;
		border-color: rgba(253, 166, 0, 1.0) transparent transparent transparent;
		border-width: 12rpx;
		position: absolute;
		right: 20rpx;
		top: 22rpx;
	}

	.swiper-tab-box .tab-up-box::before {
		border-color: transparent transparent rgba(253, 166, 0, 1.0) transparent;
		top: 18rpx;
		vertical-align: top;
	}

	.swiper-tab-box .tab-up-box {
		z-index: 400;
	}

	.swiper-tab-box .more-tab-bg {
		width: 554rpx;
		height: calc(100% - 60rpx);
		overflow-y: auto;
		background: rgba(0, 0, 0, .4);
		position: fixed;
		left: auto;
		right: 0;
		top: 60rpx;
		z-index: 300;
	}

	.swiper-tab-box .more-tab-box {
		width: 100%;
		height: auto;
		background-color: #fff;
		/* position: absolute;
		left: 0;
		top: 0;
		z-index: 300; */
		padding: 10rpx 0;
		box-sizing: border-box;
	}

	.swiper-tab-box .more-tab-box .title {
		font-size: 24rpx;
		font-weight: bold;
		color: rgba(22, 22, 22, 1);
		line-height: 50rpx;
	}

	.swiper-tab-box .more-tab-box .tab-item-box {
		flex-wrap: wrap;
		margin: 10rpx 0;
		justify-content: flex-start;
	}

	.swiper-tab-box .more-tab-box .tab-item {
		width: 170rpx;
		height: 60rpx;
		line-height: 56rpx;
		box-sizing: border-box;
		border: 2rpx solid rgba(220, 220, 220, 1);
		border-radius: 10rpx;
		margin: 5rpx 10rpx 5rpx 0;
		display: inline-block;
		font-size: 24rpx;
		font-weight: bold;
		color: rgba(22, 22, 22, 1);
		text-align: center;
	}

	.swiper-tab-box .more-tab-box .tab-item.active {
		background: rgba(253, 166, 0, 1.0);
		border: 2rpx solid rgba(253, 166, 0, 1.0);
		font-size: 24rpx;
		color: rgba(255, 255, 255, 1);
	}

	.index-tab-bar .swiper-tab-list {
		height: 50rpx;
		margin: 0 10rpx 10rpx 0;
		line-height: 50rpx;
		padding: 0 22rpx;
		width: auto;
		box-sizing: border-box;
		background: rgba(238, 238, 238, 1);
		border-radius: 10rpx;
		font-size: 24rpx;
		font-family: PingFang SC;
		color: rgba(102, 102, 102, 1);
		box-sizing: border-box;
	}

	.index-tab-bar .active {
		color: #000000;
		font-size: 28rpx;
		font-weight: bold;
		background: rgba(253, 166, 0, 1.0);
		color: rgba(255, 255, 255, 1);
	}

	/* .index-tab-bar .active .swiper-tab-line{
		margin: auto;
		width:40rpx;
		height:8rpx;
		background:rgba(253, 166, 0, 1.0);
		border-radius:4rpx;
	} */
	.edit-box{
		display: flex;
		flex-direction: row;
		align-items: center;
	}
	.edit-box.add-btn{
			padding: 13rpx;
			background: rgba(238, 238, 238, 1);
			border-radius: 0 20rpx 20rpx 0;
		}
	.right-tab-content {
		height: calc(100% - 60rpx);
	}

	.category-swiper {
		height: 100%;
	}

	.adv-image-box {
		padding-top: 10rpx;
		width: 100%;
		height: 170rpx;
		box-sizing: border-box;
	}

	.category-swiper-item {
		display: block;
		height: 100%;
		overflow-y: auto;
	}

	.old-cost. {
		text-decoration: line-through;
	}
	
	.cart-bottom-box {
		width: 100%;
		height: 120rpx;
		background: rgba(255, 255, 255, 1);
		box-shadow: 0rpx 2rpx 10rpx 0rpx rgba(115, 115, 115, 0.15);
		padding: 20rpx;
		box-sizing: border-box;
		position: fixed;
		left: 0;
		bottom: 0;
		display: flex;
		flex-direction: row;
		justify-content: center;
	}
	.cart-bottom-box .cart-bottom-box-row{
		width: 100%;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
	}
	.cart-bottom-box .check-all-box {
		width: 280rpx;
	}
	
	/* 	.cart-bottom-box checkbox-group{
		font-size:28rpx;
		font-family:PingFang SC;
		color: #161616;
		height: 80rpx;
		line-height: 80rpx;
	} */
	.cart-bottom-box .check-all-box label {
		display: block;
		font-size: 28rpx;
		font-family: PingFang SC;
		color: #161616;
		height: 80rpx;
		line-height: 80rpx;
		position: relative;
		padding-left: 40rpx;
		box-sizing: border-box;
	}
	
	.cart-bottom-box .check-all-box label checkbox {
		position: absolute;
		left: 0;
		top: -2rpx;
	}
	
	.cart-bottom-box .all-cost {
		width: 350rpx;
		height: 80rpx;
		padding-right: 38rpx;
		box-sizing: border-box;
	}
	
	.cart-bottom-box .all-cost>view {
		height: 80rpx;
		line-height: 80rpx;
		text-align: right;
		color: #161616;
	}
	
	.cart-bottom-box .all-cost text {
		color: #fda600;
		font-weight: bold;
	}
	
	.cart-bottom-box .buy-btn-box {
		width: 240rpx;
		font-size: 28rpx;
		color: rgba(255, 255, 255, 1);
	}
	
	.cart-bottom-box .buy-btn-box .to-pay {
		width: 240rpx;
		height: 80rpx;
		background: linear-gradient(180deg, rgba(253, 166, 0, 1.0), rgba(253, 166, 0, 1.0));
		border-radius: 40rpx;
		line-height: 80rpx;
		border: none;
		font-size: 28rpx;
		font-family: PingFang SC;
		color: rgba(255, 255, 255, 1);
		padding: 0;
	}
	
</style>
